<template>
  <div>
    <el-card>
      <el-form ref="ruleForm" :model="ruleForm" :rules="rules">
        <div>基础信息</div>
        <el-form-item label="岗位" prop="username" label-width="200px">
          <el-input
            v-model="ruleForm.password2"
            style="width: 400px"
            type="password"
            placeholder="请输入密码"
          />
        </el-form-item>
        <el-form-item label="转正状态" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择" disabled>
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="职级" prop="username" label-width="200px">
          <el-input
            v-model="ruleForm.password2"
            style="width: 400px"
            type="password"
            placeholder="请输入密码"
          />
        </el-form-item>

        <el-form-item label="转正评价" prop="username" label-width="200px">
          <el-input
            v-model="ruleForm.password2"
            style="width: 600px"
            type="textarea"
            placeholder="请输入密码"
          />
        </el-form-item>

        <el-form-item label="汇报对象" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="HRBP" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item
          label="调整司龄（天）"
          prop="username"
          label-width="200px"
        >
          <el-input
            v-model="ruleForm.password2"
            placeholder="请输入密码"
            style="width: 400px"
          />
        </el-form-item>

        <el-form-item
          label="首次参加工作时间"
          prop="username"
          label-width="200px"
        >
          <el-date-picker v-model="value1" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="调整工龄" prop="username" label-width="200px">
          <el-input
            v-model="ruleForm.password2"
            placeholder="请输入密码"
            disabled
            style="width: 400px"
          />
        </el-form-item>
        <div>合同信息</div>
        <el-form-item
          label="首次合同开始时间"
          prop="username"
          label-width="200px"
        >
          <el-date-picker v-model="value1" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item
          label="首次合同结束时间"
          prop="username"
          label-width="200px"
        >
          <el-date-picker v-model="value1" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item
          label="现合同开始时间"
          prop="username"
          label-width="200px"
        >
          <el-date-picker v-model="value1" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item
          label="现合同结束时间"
          prop="username"
          label-width="200px"
        >
          <el-date-picker v-model="value1" type="date" placeholder="选择日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="合同期限" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="续签次数" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <div>招聘信息</div>
        <el-form-item label="其他招聘渠道" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="招聘渠道" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="社招/校招" prop="password" label-width="200px">
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in ruleForm.option"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="推荐企业/人" label-width="200px">
          <el-input
            v-model="ruleForm.mobile"
            style="width: 400px"
            placeholder="请输入手机号"
          />
        </el-form-item>
        <el-form-item label-width="200px">
          <el-button type="primary">保存更新</el-button>
          <el-button>返回</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>
<script>
export default {
  data() {
    return {
      ruleForm: {
        username: "",
        password2: "",
        mobile: "",
        options: [
          {
            value: "选项1",
            label: "黄金糕",
          },
        ],
      },
      activeName: "first",
      userId: "",
      rules: {
        username: [
          { required: true, message: "请输入姓名", trigger: "change" },
          { min: 2, max: 5, message: "长度在 2 到 5个字符", trigger: "blur" },
        ],
        password2: [
          { required: true, message: "新密码不能为空", trigger: "change" },
          { min: 6, max: 16, message: "密码长度在6~16位", trigger: "blur" },
        ],
      },
    };
  },
};
</script>